<template>
    <div class="editClass">
        <el-dialog v-model="classDialog" title="添加班级" width="600">
            <el-form :model="classForm" :rules="classRules" ref="userRef" label-width="80px">
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="学院" prop="major">
                            <el-select v-model="classForm.major" placeholder="请选择学院">   
                                <el-option v-for="item in collegeList" :value="item.name" />
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="24">
                        <el-form-item label="专业" prop="profession">
                            <el-select v-model="classForm.profession" placeholder="请选择专业">
                                <el-option v-for="item in majorListData" :label="item.name" :value="item.id" />
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="24">
                        <el-form-item label="班级名称" prop="className">
                            <el-input v-model.trim="classForm.className" placeholder="请输入班级名称" maxlength="30" />
                        </el-form-item>
                    </el-col>

        

                    <el-col :span="24">
                        <el-form-item label="备注信息">
                            <el-input v-model.trim="classForm.memo" placeholder="请输入备注信息" maxlength="30" />
                        </el-form-item>
                    </el-col>

                </el-row>


            </el-form>

            <template #footer>
                <div class="dialog-footer">
                    <el-button :disabled="addClassDisabled" @click="addRowClass" type="primary">
                        确定
                    </el-button>
                    <el-button @click="classDialog = false">取消</el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<script setup>
import { ref, watch } from "vue"
import { majorList, delMajor } from "@/api/admin/major"
import { addClass } from "@/api/banji/classadmin"
import { ElMessage } from 'element-plus'
import useUserStore from '@/store/modules/user'
const { proxy } = getCurrentInstance();
const emits = defineEmits(['addSuccess']);
const props = defineProps({
    arch: {
        type: Array
    },
    classId: {
        type: Number
    },
    tenant_id:{
        type:String
    }
})
const classDialog = ref(false)
const addClassDisabled=ref(false)
const archList=ref([])
const tenant_id=ref()
const collegeList=ref([])
watch(()=>props.arch,(nv)=>{
    archList.value=nv
},{
    immediate:true
})

watch(()=>props.tenant_id,(nv)=>{
    if(nv){
        tenant_id.value=nv
        collegeList.value=archList.value.find(item=>item.tenant_id==tenant_id.value).children
    }
    
},{
    immediate:true
})

// 专业列表
const majorListData = ref([])

const classForm = ref({
    major: "",
    className: "",
    profession: "",
    memo: ""
})

const classRules = ref({
    major: [{ required: true, message: "学院不能为空", trigger: "blur" }],
    className: [{ required: true, message: "班级名称不能为空", trigger: "blur" }],
    profession: [{ required: true, message: "专业必须选择", trigger: "blur" }],
})

// 添加班级
const addRowClass = () => {
    addClassDisabled.value=true
    proxy.$refs.userRef.validate(valid => {
        if (valid) {
            let data = {
                "cg_class": {
                    "cla_name": classForm.value.className,
                    "cla_desc": classForm.value.memo,
                    "college_arch_stu_group_id": props.classId,// 上级组织id {仅可以选择 学生组}
                    "marjor_id": classForm.value.profession, // 专业id
                    "tenant_id":useUserStore().tenant_id
                }
            }
            addClass(data).then(res => {
                if (res) {
                    ElMessage.success("班级添加成功")
                    classDialog.value = false
                    addClassDisabled.value=false
                    emits("addSuccess")
                }

            })

        }

    })
}
// 获取专业列表
const getMajorList = () => {
    majorList().then(res => {
        majorListData.value = res
    })
}

getMajorList()
defineExpose({
    classDialog,
    classForm
})
</script>

<style lang="scss" scoped></style>